<template>
    <div class="page">
      <h2>忘记密码?</h2>
      <form @submit.prevent="handleForgotPassword">
        <div class="input-group">
          <label for="username">账号:</label>
          <input
            type="text"
            id="username"
            v-model="username"
            placeholder="请输入账号"
            required
          />
        </div>
        <button type="submit" class="forgot-password-button">提交</button>
      </form>
      <div class="links">
        <a href="#" @click.prevent="$emit('toggleForm', 'login')">返回登录</a>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        username: '',
      };
    },
    methods: {
      handleForgotPassword() {
        if (this.username.trim()) {
          // 如果账号不为空，通知父组件切换到重置密码页面
          this.$emit('toggleForm', 'resetPassword');
        } else {
          alert('请输入账号');
        }
      },
    },
  };
  </script>